<!-- by 7527189 2 0 -->
<template>
    <a-row :gutter="24">
        <a-col :md="24">
            <a-card :style="cardStyle" :bordered="false">
                <!-- 查询区域 -->
                <div class="table-page-search-wrapper">
                    <!-- 搜索区域 -->
                    <a-form layout="inline" @keyup.enter.native="searchQuery">
                        <a-row :gutter="24">
                            <a-col :md="6" :sm="24">
                                <a-form-item label="类别" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                    <a-tree-select style="width: 100%"
                                        :dropdownStyle="{ maxHeight: '200px', overflow: 'auto' }" allow-clear
                                        :treeData="categoryTree" v-model="queryParam.categoryId" placeholder="请选择类别">
                                    </a-tree-select>
                                </a-form-item>
                            </a-col>
                            <a-col :md="6" :sm="24">
                                <a-form-item label="关键词" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                    <a-input style="width: 100%" placeholder="请输入条码、名称、规格、型号查询"
                                        v-model="queryParam.materialParam"></a-input>
                                </a-form-item>
                            </a-col>
                            <a-col :md="6" :sm="24">
                                <a-form-item label="状态" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                    <a-select style="width: 100%" placeholder="请选择状态" v-model="queryParam.enabled">
                                        <a-select-option value="1">启用</a-select-option>
                                        <a-select-option value="0">禁用</a-select-option>
                                    </a-select>
                                </a-form-item>
                            </a-col>

                            <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
                                <a-col :md="6" :sm="24">
                                    <a-button type="primary" @click="searchQuery">查询</a-button>
                                    <a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
                                    <a @click="handleToggleSearch" style="margin-left: 8px">
                                        {{ toggleSearchStatus ? "收起" : "展开" }}
                                        <a-icon :type="toggleSearchStatus ? 'up' : 'down'" />
                                    </a>
                                </a-col>
                            </span>
                            <template v-if="toggleSearchStatus">
                                <a-col :md="6" :sm="24">
                                    <a-form-item label="供应商" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                        <a-input style="width: 100%" placeholder="请输入供应商信息查询"
                                            v-model="queryParam.supplier"></a-input>
                                    </a-form-item>
                                </a-col>
                                <a-col :md="6" :sm="24">
                                    <a-form-item label="颜色" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                        <a-input style="width: 100%" placeholder="请输入颜色查询"
                                            v-model="queryParam.color"></a-input>
                                    </a-form-item>
                                </a-col>
                                <a-col :md="6" :sm="24">
                                    <a-form-item label="序列号" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                        <a-select style="width: 100%" placeholder="有无序列号"
                                            v-model="queryParam.enableSerialNumber">
                                            <a-select-option value="1">有</a-select-option>
                                            <a-select-option value="0">无</a-select-option>
                                        </a-select>
                                    </a-form-item>
                                </a-col>
                                <a-col :md="6" :sm="24">
                                    <a-form-item label="批号" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                        <a-select style="width: 100%" placeholder="有无批号"
                                            v-model="queryParam.enableBatchNumber">
                                            <a-select-option value="1">有</a-select-option>
                                            <a-select-option value="0">无</a-select-option>
                                        </a-select>
                                    </a-form-item>
                                </a-col>
                                <a-col :md="6" :sm="24">
                                    <a-form-item label="仓位货架" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                        <a-input style="width: 100%" placeholder="请输入仓位货架查询"
                                            v-model="queryParam.position"></a-input>
                                    </a-form-item>
                                </a-col>
                                <a-col :md="6" :sm="24">
                                    <a-form-item label="扩展信息" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                        <a-input style="width: 100%" placeholder="请输入扩展信息查询"
                                            v-model="queryParam.materialOther"></a-input>
                                    </a-form-item>
                                </a-col>
                                <a-col :md="6" :sm="24">
                                    <a-form-item label="基础重量" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                        <a-input-number style="width: 100%" placeholder="请输入基础重量查询"
                                            v-model="queryParam.weight"></a-input-number>
                                    </a-form-item>
                                </a-col>
                                <a-col :md="6" :sm="24">
                                    <a-form-item label="保质期" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                        <a-input-number style="width: 100%" placeholder="请输入保质期查询"
                                            v-model="queryParam.expiryNum"></a-input-number>
                                    </a-form-item>
                                </a-col>
                                <a-col :md="6" :sm="24">
                                    <a-form-item label="备注" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                        <a-input style="width: 100%" placeholder="请输入备注查询"
                                            v-model="queryParam.remark"></a-input>
                                    </a-form-item>
                                </a-col>
                                <a-col :md="6" :sm="24">
                                    <a-form-item label="审核状态" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                        <a-select style="width: 100%" placeholder="审核状态" v-model="queryParam.status">
                                            <a-select-option :value="s.value" v-for="s in status"
                                                :key="s.value">{{ s.label }}</a-select-option>
                                        </a-select>
                                    </a-form-item>
                                </a-col>
                                <a-col :md="6" :sm="24">
                                    <a-form-item label="采购价" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                        <a-input-number style="width: 100%;" placeholder="请输入采购价" :precision="2"
                                            :min="0" :step="0.01" v-model="queryParam.purchaseDecimal" />
                                    </a-form-item>
                                </a-col>
                                <a-col :md="6" :sm="24">
                                    <a-form-item label="零售价" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                        <a-input-number style="width: 100%;" placeholder="请输入零售价" :precision="2"
                                            :min="0" :step="0.01" v-model="queryParam.retailPrice" />
                                    </a-form-item>
                                </a-col>
                                <!-- 内部价和批发价只有总店才显示 -->
                                <a-col :md="6" :sm="24" v-if="isMainStore()">
                                    <a-form-item label="内部价" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                        <a-input-number style="width: 100%;" placeholder="请输入内部价" :precision="2"
                                            :min="0" :step="0.01" v-model="queryParam.lowDecimal" />
                                    </a-form-item>
                                </a-col>
                                <a-col :md="6" :sm="24" v-if="isMainStore()">
                                    <a-form-item label="批发价" :labelCol="labelCol" :wrapperCol="wrapperCol">
                                        <a-input-number style="width: 100%;" placeholder="请输入批发价" :precision="2"
                                            :min="0" :step="0.01" v-model="queryParam.commodityDecimal" />
                                    </a-form-item>
                                </a-col>
                            </template>
                        </a-row>
                    </a-form>
                </div>
                <!-- 操作按钮区域 -->
                <div class="table-operator" style="margin-top: 5px">
                    <a-button v-if="btnEnableList.indexOf(1) > -1" @click="handleAdd" type="primary"
                        icon="plus">新增</a-button>
                    <a-button v-if="btnEnableList.indexOf(2) > -1" @click="batchAudit('1')" type="primary"
                        icon="check">审核</a-button>
                    <a-button v-if="btnEnableList.indexOf(7) > -1" @click="batchAudit('10')" type="primary"
                        icon="close">驳回</a-button>
                    <a-button v-if="btnEnableList.indexOf(9) > -1" @click="handleDistribution" type="primary"
                        icon="usergroup-add">分配</a-button>
                    <a-button v-if="btnEnableList.indexOf(3) > -1" @click="handleImportXls()" type="primary"
                        icon="import">导入</a-button>
                    <a-button type="primary" v-if="btnEnableList.indexOf(3) > -1" icon="download"
                        @click="handleExportXls('商品信息')">导出</a-button>
                    <a-dropdown>
                        <a-menu slot="overlay">
                            <a-menu-item key="1" v-if="btnEnableList.indexOf(1) > -1" @click="batchDel"><a-icon
                                    type="delete" />删除</a-menu-item>
                            <a-menu-item key="2" v-if="btnEnableList.indexOf(4) > -1"
                                @click="batchSetStatus(true)"><a-icon type="check-square" />启用</a-menu-item>
                            <a-menu-item key="3" v-if="btnEnableList.indexOf(4) > -1"
                                @click="batchSetStatus(false)"><a-icon type="close-square" />禁用</a-menu-item>
                            <a-menu-item key="4" v-if="btnEnableList.indexOf(1) > -1" @click="batchEdit()"><a-icon
                                    type="edit" />批量编辑</a-menu-item>
                            <a-menu-item key="5" v-if="btnEnableList.indexOf(1) > -1"
                                @click="batchSetMaterialCurrentStock()"><a-icon type="stock" />修正库存</a-menu-item>
                            <a-menu-item key="6" v-if="btnEnableList.indexOf(5) > -1" @click="batchPrint"><a-icon
                                    type="printer" />打印</a-menu-item>
                            <!-- <a-menu-item key="7" v-if="btnEnableList.indexOf(1) > -1" @click="batchAudit('10')"><a-icon
                                    type="sync" />驳回</a-menu-item> -->
                        </a-menu>
                        <a-button> 批量操作 <a-icon type="down" /> </a-button>
                    </a-dropdown>
                    <a-popover trigger="click" placement="right">
                        <template slot="content">
                            <a-checkbox-group @change="onColChange" v-model="settingDataIndex"
                                :defaultValue="settingDataIndex">
                                <a-row style="width: 500px">
                                    <template v-for="(item, index) in defColumns">
                                        <template>
                                            <a-col :span="8">
                                                <a-checkbox :value="item.dataIndex">
                                                    <j-ellipsis :value="item.title" :length="10"></j-ellipsis>
                                                </a-checkbox>
                                            </a-col>
                                        </template>
                                    </template>
                                </a-row>
                                <a-row style="padding-top: 10px">
                                    <a-col> 恢复默认列配置：<a-button @click="handleRestDefault" type="link"
                                            size="small">恢复默认</a-button> </a-col>
                                </a-row>
                            </a-checkbox-group>
                        </template>
                        <a-button icon="setting">列设置</a-button>
                    </a-popover>
                </div>
                <!-- table区域-begin -->
                <div>
                    <a-table ref="table" size="middle" bordered rowKey="id" :columns="columns" :dataSource="dataSource"
                        :components="handleDrag(columns)" :pagination="ipagination" :scroll="scroll" :loading="loading"
                        :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange, columnWidth: '40px' }"
                        @change="handleTableChange">
                        <span slot="action" slot-scope="text, record">
                            <a @click="handleEdit(record)">编辑</a>
                            <a-divider v-if="btnEnableList.indexOf(1) > -1" type="vertical" />
                            <a-popconfirm v-if="btnEnableList.indexOf(1) > -1" title="确定删除吗?"
                                @confirm="() => handleDelete(record.id)">
                                <a>删除</a>
                            </a-popconfirm>
                        </span>
                        <template slot="customPic" slot-scope="text, record">
                            <a-popover placement="right" trigger="click">
                                <template slot="content">
                                    <img :src="getImgUrl(record.imgName, record.imgLarge)" width="500px" />
                                </template>
                                <div style="width: 52px; height: 52px" v-if="record.imgName">
                                    <img v-if="record.imgName" :src="getImgUrl(record.imgName, record.imgSmall)"
                                        class="item-img" title="查看大图" />
                                </div>
                            </a-popover>
                        </template>
                        <template slot="customBarCode" slot-scope="text, record">
                            {{ record.mBarCode }}
                        </template>
                        <template slot="customName" slot-scope="text, record">
                            {{ record.name }}
                            <a-tag v-if="record.enableSerialNumber == 1" color="orange">序</a-tag>
                            <a-tag v-if="record.enableBatchNumber == 1" color="orange">批</a-tag>
                        </template>
                        <template slot="customRenderStock" slot-scope="text, record">
                            <a-tooltip :title="record.bigUnitStock">
                                {{ text }}
                            </a-tooltip>
                        </template>
                        <template slot="customRenderEnabled" slot-scope="enabled">
                            <a-tag v-if="enabled" color="green">启用</a-tag>
                            <a-tag v-if="!enabled" color="orange">禁用</a-tag>
                        </template>
                        <template slot="customRenderStatus" slot-scope="text, record">
                            <a-tag :color="getStatusInfo(text).color">{{ getStatusInfo(text).label }}</a-tag>
                        </template>
                    </a-table>
                </div>
                <!-- table区域-end -->
                <!-- 表单区域 -->
                <material-modal ref="modalForm" @ok="modalFormOk"></material-modal>
                <import-file-modal ref="modalImportForm" @ok="modalFormOk"></import-file-modal>
                <batch-set-info-modal ref="batchSetInfoModalForm" @ok="modalFormOk"></batch-set-info-modal>
                <distribution-modal ref="distributionForm" @ok="modalFormOk"
                    @close="modalFormClose"></distribution-modal>
            </a-card>
        </a-col>
    </a-row>
</template>
<script>
import MaterialModal from "./modules/MaterialModal";
import ImportFileModal from "@/components/tools/ImportFileModal";
import BatchSetInfoModal from "./modules/BatchSetInfoModal";
import DistributionModal from "./modules/DistributionModal";
import { queryMaterialCategoryTreeList } from "@/api/api";
import { postAction, getFileAccessHttpUrl } from "@/api/manage";
import { getMpListShort, generateQRCode } from "@/utils/util";
import { JeecgListMixin } from "@/mixins/JeecgListMixin";
import JEllipsis from "@/components/jeecg/JEllipsis";
import JDate from "@/components/jeecg/JDate";
import { USER_INFO } from "@/store/mutation-types";
import Vue from "vue";
import pick from "lodash.pick";

export default {
    name: "MaterialList",
    mixins: [JeecgListMixin],
    components: {
        MaterialModal,
        ImportFileModal,
        BatchSetInfoModal,
        JEllipsis,
        JDate,
        DistributionModal,
    },
    data() {
        return {
            categoryTree: [],
            mPropertyListShort: "",
            model: {},
            labelCol: {
                span: 5,
            },
            wrapperCol: {
                span: 18,
                offset: 1,
            },
            // 查询条件
            queryParam: {
                categoryId: "",
                materialParam: "",
                color: "",
                materialOther: "",
                weight: "",
                expiryNum: "",
                enabled: "1",
                enableSerialNumber: undefined,
                enableBatchNumber: undefined,
                position: "",
                remark: "",
                mpList: getMpListShort(Vue.ls.get("materialPropertyList")), //扩展属性
                status: undefined,
                purchaseDecimal: undefined,
                retailPrice: undefined,
                lowDecimal: undefined,
                commodityDecimal: undefined,
            },
            ipagination: {
                pageSizeOptions: ["10", "20", "30", "50", "100", "200"],
            },
            // 实际索引
            settingDataIndex: [],
            // 实际列
            columns: [],
            // 默认索引
            defDataIndex: ["action", "pic", "mBarCode", "name", "standard", "supplier", "model", "color", "categoryName", "materialOther", "unit", "stock", "purchaseDecimal", "commodityDecimal", "wholesaleDecimal", "lowDecimal", "retailPrice", "highDecimal", "creatorStr", "enabled", "status"],
            // 默认列
            defColumns: [
                {
                    title: "操作",
                    dataIndex: "action",
                    align: "center",
                    width: 100,
                    scopedSlots: { customRender: "action" },
                },
                { title: "图片", dataIndex: "pic", width: 65, scopedSlots: { customRender: "customPic" } },
                { title: "条码", dataIndex: "mBarCode", width: 120 },
                { title: "名称", dataIndex: "name", width: 160, scopedSlots: { customRender: "customName" } },
                { title: "规格", dataIndex: "standard", width: 120 },
                { title: "供应商", dataIndex: "supplier", width: 120 },
                { title: "型号", dataIndex: "model", width: 120 },
                { title: "颜色", dataIndex: "color", width: 70, ellipsis: true },
                { title: "类别", dataIndex: "categoryName", width: 100, ellipsis: true },
                { title: "扩展信息", dataIndex: "materialOther", width: 100, ellipsis: true },
                {
                    title: "单位",
                    dataIndex: "unit",
                    width: 100,
                    ellipsis: true,
                    customRender: function (t, r, index) {
                        if (r) {
                            let name = t ? t : r.unitName;
                            if (r.sku) {
                                return name + "[SKU]";
                            } else {
                                return name;
                            }
                        }
                    },
                },
                { title: "基础重量", dataIndex: "weight", width: 80 },
                { title: "保质期", dataIndex: "expiryNum", width: 60 },
                { title: "库存", dataIndex: "stock", width: 80, scopedSlots: { customRender: "customRenderStock" } },
                { title: "采购价", dataIndex: "purchaseDecimal", width: 80 },
                { title: "内部价", dataIndex: "lowDecimal", width: 80 },
                { title: "批发价", dataIndex: "commodityDecimal", width: 80 },
                // { title: 'VIP价', dataIndex: 'wholesaleDecimal', width: 80 },
                { title: "零售价", dataIndex: "retailPrice", width: 80 },
                { title: "运输成本", dataIndex: "transportCost", width: 80 },
                // { title: '最高售价', dataIndex: 'highDecimal', width: 80 },
                { title: "仓位货架", dataIndex: "position", width: 80 },
                { title: "备注", dataIndex: "remark", width: 80 },
                { title: "操作人", dataIndex: "creatorStr", width: 70 },
                { title: "推送门店", dataIndex: "initTenantStr", width: 80, align: "left" },
                {
                    title: "状态",
                    dataIndex: "enabled",
                    align: "center",
                    width: 60,
                    scopedSlots: { customRender: "customRenderEnabled" },
                },
                {
                    title: "审核状态",
                    dataIndex: "status",
                    align: "center",
                    width: 80,
                    scopedSlots: { customRender: "customRenderStatus" },
                },
            ],
            mainStoreCanLook: ["lowDecimal", "commodityDecimal", "initTenantStr"],
            url: {
                list: "/material/list",
                delete: "/material/delete",
                deleteBatch: "/material/deleteBatch",
                importExcelUrl: "/material/importExcel",
                exportXlsUrl: "/material/exportExcel",
                batchSetStatusUrl: "/material/batchSetStatus",
                batchSetMaterialCurrentStockUrl: "/material/batchSetMaterialCurrentStock",
                batchAudit: "/material/batchSetAuditStatus",
            },
            status: [
                { label: "未审核", value: "0", color: "#cccccc" },
                { label: "已审核", value: "1", color: "#87d068" },
                { label: "驳回", value: "10", color: "#f50" },
            ],
        };
    },
    created() {
        this.model = Object.assign({}, {});
        this.filterColumns();
        this.initColumnsSetting();
        this.loadTreeData();
    },
    computed: {
        importExcelUrl: function () {
            return `${window._CONFIG["domianURL"]}${this.url.importExcelUrl}`;
        },
    },
    methods: {
        //过滤
        filterColumns() {
            let isMainStore = this.isMainStore();
            if (!isMainStore) {
                this.defDataIndex = this.defDataIndex.filter((item) => !this.mainStoreCanLook.includes(item));
                this.defColumns = this.defColumns.filter((item) => !this.mainStoreCanLook.includes(item.dataIndex));
            }
        },
        initColumnsSetting() {
            let columnsStr = Vue.ls.get("materialColumns");
            if (columnsStr && columnsStr.indexOf(",") > -1) {
                this.settingDataIndex = columnsStr.split(",");
            } else {
                this.settingDataIndex = this.defDataIndex;
            }
            this.columns = this.defColumns.filter((item) => {
                return this.settingDataIndex.includes(item.dataIndex);
            });
        },
        isMainStore() {
            let userInfo = Vue.ls.get(USER_INFO);
            return userInfo.tenantId === userInfo.headOfficeTenantId;
        },
        //列设置更改事件
        onColChange(checkedValues) {
            this.columns = this.defColumns.filter((item) => {
                return checkedValues.includes(item.dataIndex);
            });
            let columnsStr = checkedValues.join();
            Vue.ls.set("materialColumns", columnsStr);
        },
        //恢复默认
        handleRestDefault() {
            Vue.ls.remove("materialColumns");
            this.initColumnsSetting();
        },
        loadTreeData() {
            let that = this;
            let params = {};
            params.id = "";
            queryMaterialCategoryTreeList(params).then((res) => {
                if (res) {
                    that.categoryTree = [];
                    for (let i = 0; i < res.length; i++) {
                        let temp = res[i];
                        that.categoryTree.push(temp);
                    }
                }
            });
        },
        batchSetMaterialCurrentStock() {
            if (this.selectedRowKeys.length <= 0) {
                this.$message.warning("请选择一条记录！");
            } else {
                let ids = "";
                for (let a = 0; a < this.selectedRowKeys.length; a++) {
                    ids += this.selectedRowKeys[a] + ",";
                }
                let that = this;
                this.$confirm({
                    title: "确认操作",
                    content: "是否操作选中数据?",
                    onOk: function () {
                        that.loading = true;
                        postAction(that.url.batchSetMaterialCurrentStockUrl, { ids: ids })
                            .then((res) => {
                                if (res.code === 200) {
                                    that.$message.info("修正库存成功！");
                                    that.loadData();
                                    that.onClearSelected();
                                } else {
                                    that.$message.warning(res.data.message);
                                }
                            })
                            .finally(() => {
                                that.loading = false;
                            });
                    },
                });
            }
        },
        batchEdit() {
            if (this.selectedRowKeys.length <= 0) {
                this.$message.warning("请选择一条记录！");
            } else {
                let ids = "";
                for (let a = 0; a < this.selectedRowKeys.length; a++) {
                    if (a === this.selectedRowKeys.length - 1) {
                        ids += this.selectedRowKeys[a];
                    } else {
                        ids += this.selectedRowKeys[a] + ",";
                    }
                }
                this.$refs.batchSetInfoModalForm.edit(ids);
                this.$refs.batchSetInfoModalForm.title = "批量编辑";
            }
        },
        async batchPrint() {
            if (this.selectionRows.length <= 0) {
                this.$message.warning("请至少选择一张单据！");
                return;
            }
            let obj = {};
            for (const row of this.selectionRows) {
                obj[row.id] = (await generateQRCode({ mBarCode: row.mBarCode })).url;
            }

            // 将打印页面设置为内框架内容
            const newIframe = document.createElement("iframe");
            newIframe.setAttribute("style", "width:0px;height:0px;position:absolute;left:-9999px;top:-9999px;");
            newIframe.setAttribute("align", "center");
            document.body.appendChild(newIframe);
            let doc = null;
            doc = newIframe.contentWindow.document;
            let styleStr = `
    <style type="text/css">
        /* 浏览器打印基本样式 */
        @media print {
          @page {
            size: auto;
            margin: 0mm; /* 影响打印小票的边缘margin */
            table { page-break-after: auto; }
            tr    { page-break-inside: avoid; page-break-after: auto; }
            td    { page-break-inside: avoid; page-break-after: auto; }
            thead { display: table-header-group; }
            tfoot { display: table-footer-group; }
          }
        }
        /* 打印页面样式 */
        .print_box {width: 100%;height: 100%;font-size: 10px;line-height: 16px;box-sizing: border-box;padding-left:20px;padding-top:10px}
        .print_title {width: 100%;text-align: left;font-size: 14px;font-weight: bold;margin-left:8px;display:flex;}
        .print_title span:last-of-type{font-size:12px;font-weight:normal;}
        .print_content {width: 100%;display: flex;margin-top:12px}
        .print_ct_right{margin-left:16px}
        .print_ct_right img{width:70px;}
        .er{font-size:36px;font-weight:bolder;display:block;text-align:center;line-height:40px;font-family:"隶书"}
        .little-er{text-align:center;font-size:24px;font-weight:bold;font-family:'华文隶书';line-height:28px}
        ._title{flex:1;}
        .title_box{}
        .print_widthBig {width: 60%;}
        .print_widthSmall {width: 20%;}
        .print_fontSmall{font-size: 8px;}
        .print_paddingLeft{padding-left: 2px;}
        .print_foot {display: flex;justify-content: space-between;}
        .print_center {text-align: center;}
        .divide_line {justify-content: center;border-bottom: 1px dashed rgba(51, 51, 51, 1);}
        /* 打印页面样式，一个class一个class写，可以.classA .classB {}, 但不要嵌套，不要.classA { .classB {} } */
    </style>`;
            let boxs = "";
            for (let i = 0; i < this.selectionRows.length; i++) {
                let item = this.selectionRows[i];
                boxs += `
                <div class="print_box">
                    <div class="title_box">
                        <div class="print_title">
                            <span class="xh">型号: &nbsp;</span>
                            <span class="_title">${item.mBarCode || ""}</span>
                        </div>
                        <div class="print_title">
                            <span class="pm">品名: &nbsp;</span>
                            <span class="_title">${item.name}${item.standard ? "&" + item.standard : ""}</span>
                        </div>
                    </div>
                    <div class="print_content">
                        <div class="print_ct_left">
                            <div class="er">贰</div>
                            <div class="little-er">小贰家</div>
                        </div>
                        <div class="print_ct_right">
                            <img src="${obj[item.id]}"/>
                        </div>
                    </div>
                </div>`;
            }
            doc.write(`${styleStr}${boxs}</div>`);
            doc.close();
            // 浏览器打印页面打开渲染
            setTimeout(() => {
                newIframe.contentWindow.focus();
                newIframe.contentWindow.print();
                document.body.removeChild(newIframe); // 移除打印内框架，下次打印下次再挂载
            }, 10);
        },
        handleEdit: function (record) {
            this.$refs.modalForm.edit(record);
            this.$refs.modalForm.title = "编辑";
            this.$refs.modalForm.disableSubmit = false;
            if (this.btnEnableList.indexOf(1) === -1) {
                this.$refs.modalForm.showOkFlag = false;
            }
        },
        getImgUrl(imgName, type) {
            if (imgName && imgName.split(",")) {
                type = type ? type + "/" : "";
                return getFileAccessHttpUrl("systemConfig/static/" + imgName.split(",")[0]);
            } else {
                return "";
            }
        },
        handleImportXls() {
            let importExcelUrl = this.url.importExcelUrl;
            let templateUrl = "/doc/goods_template.xls";
            let templateName = "商品Excel模板[下载]";
            this.$refs.modalImportForm.initModal(importExcelUrl, templateUrl, templateName);
            this.$refs.modalImportForm.title = "商品导入";
        },
        searchReset() {
            this.queryParam = {
                mpList: getMpListShort(Vue.ls.get("materialPropertyList")), //扩展属性
            };
            this.loadData(1);
        },
        // 解析审核状态
        getStatusInfo(text) {
            let noStatusObj = {
                label: "无状态",
                value: "-1",
                color: "orange",
            };
            if (isNaN(parseInt(text))) {
                return noStatusObj;
            }
            let statusInfo = this.status.find((item) => item.value === text);
            if (!statusInfo) {
                return noStatusObj;
            }
            return statusInfo;
        },

        handleDistribution() {
            if (this.selectedRowKeys.length <= 0) {
                this.$message.warning("请选择一条记录！");
                return;
            }
            let refForm = this.$refs.distributionForm;
            refForm.title = "分配";
            refForm.add({ mIds: this.selectedRowKeys });
        },
    },
};
</script>
<style scoped>
@import "~@assets/less/common.less";
</style>
<style>
.item-img {
    cursor: pointer;
    position: static;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
</style>
